<?xml version="1.0" encoding="UTF-8"?>
<!--
To change this template, choose Tools | Templates
and open the template in the editor.
-->
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>TODO supply a title</title>
    </head>
    <body>
        <div>
            <ui:composition xmlns="http://www.w3.org/1999/xhtml"
                            xmlns:ui="http://java.sun.com/jsf/facelets"
                            xmlns:h="http://java.sun.com/jsf/html"
                            xmlns:f="http://java.sun.com/jsf/core"
                            xmlns:a4j="http://richfaces.org/a4j"
                            xmlns:rich="http://richfaces.org/rich">

                <style type="text/css">
                    .pic{
                        margin-bottom: -4px;
                        margin-right: 2px;
                        border:none;
                    }
                    .otherjdept{
                        height:100px;
                        overflow: scroll;
                    }
                    input[type = 'submit']{
                        margin:5px 0px 5px 10px;
                        padding:3px 5px 3px 5px;
                    }
                    .top{
                        vertical-align:top;
                    }
                    .left{
                        vertical-align:top;
                    }
                    .right{
                        vertical-align:top; 
                    }
                </style>
                <h:form id="aa">
                    <rich:panel header="经济科目数据配置" styleClass="content-hight">
                        <rich:toolbar>
                            <rich:toolbarGroup>
                                <a4j:commandButton value="保存" action="#{ecoDataInterfaceBean.save}" render="@this,editGroup"
                                                   onclick="this.disabled = 'true'"
                                                   disabled="#{ecoDataInterfaceBean.eco.isEnd eq '0'}"/>
                                <a4j:commandButton value="取消" render="editGroup"/>
                            </rich:toolbarGroup>
                        </rich:toolbar>
                        <h:panelGrid columns="2" width="80%" columnClasses="left,right"  id="edit">
                            <h:panelGroup>
                                <div style="max-height:400px;width:300px;overflow:auto">
                                    <rich:tree value="#{ecoDataInterfaceBean.treeNode}" var="idept"
                                               selectionType="ajax" toggleType="client"
                                               selectionChangeListener="#{ecoDataInterfaceBean.selected}"
                                               render="deptinfo,editGroup">
                                        <rich:treeNode>
                                            [#{idept.data.code}]#{idept.data.name}                                
                                        </rich:treeNode>
                                    </rich:tree>
                                </div>
                            </h:panelGroup>
                            <h:panelGrid columns="2" id="editGroup" columnClasses="top,top">
                                <h:panelGroup rendered="#{ecoDataInterfaceBean.eco != null and !(ecoDataInterfaceBean.eco.code eq '')}">
                                    <div style="width:300px;height:400px;overflow:auto;">
                                        <rich:dataTable id ="interfaceli"
                                                        value ="#{ecoDataInterfaceBean.datali}" var ="edi"
                                                        onrowmouseover="this.style.backgroundColor='#F1F1F1'"
                                                        onrowmouseout="this.style.backgroundColor='#{a4jSkin.tableBackgroundColor}'"
                                                        rowClasses="list-row-odd,list-row-even"
                                                        style="width:260px"
                                                        noDataLabel="无数据!">
                                            <f:facet name="header">
                                                <h:outputText value="#{ecoDataInterfaceBean.eco.name} - " style="color: chocolate"/>
                                                配置明细
                                            </f:facet>
                                            <rich:column>
                                                <f:facet name="header">选择</f:facet>
                                                <h:selectBooleanCheckbox value="#{edi.selected}"
                                                                         disabled="#{ecoDataInterfaceBean.eco.isEnd eq '0'}">
                                                    <a4j:ajax event="click" render="interfaceli"/>
                                                </h:selectBooleanCheckbox>
                                            </rich:column>
                                            <rich:column>
                                                <f:facet name ="header">代码</f:facet>
                                                <h:outputText value="#{edi.code}" rendered="#{edi.selected}"
                                                              style="color: green"/>
                                                <h:outputText value="#{edi.code}" rendered="#{!edi.selected}"/>
                                            </rich:column>
                                            <rich:column>
                                                <f:facet name="header">名称</f:facet>
                                                <h:outputText value="#{edi.name}" rendered="#{edi.selected}"
                                                              style="color: green"/>
                                                <h:outputText value="#{edi.name}" rendered="#{!edi.selected}"/>
                                            </rich:column>
                                        </rich:dataTable>
                                    </div>
                                </h:panelGroup>
                            </h:panelGrid>
                        </h:panelGrid>
                    </rich:panel>
                </h:form>
            </ui:composition>
        </div>
    </body>
</html>
